@border-color: #2eb6db;
@border-color-error: red;

.cil__info-item-blocks {
  display: flex;
  flex-direction: column;
  justify-content: space-between;

  .cil__info-item-block {
    height: 160px;
    background-color: #fff;
    border-radius: 4px;

    .cil__info-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      height: 100%;

      .cil__info-item--div {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;

        .cil__label {
          font-size: 14px;
          color:#a2a2a3;
          margin-bottom: 23px;
        }

        .cil__label.diff {
          color: rgb(255, 174, 0);
        }

        .cil__value {
          font-size: 15px;
          color: #070809;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 3;
          overflow: hidden;
          text-overflow:ellipsis;
          white-space: nowrap;
          width: 90%;
          text-align: -webkit-center;
          max-width: 900px;
        }

        .cil__value.diff {
          color: rgb(255, 174, 0);
        }

        // Style for enable input
        .cil__input {
          font-weight: bolder;
          width: 90%;
        }

        // Color when text is disabled edit
        .disableEdit {
          color: grey
        }

        .editable {
          color: @border-color;
        }
        .errorEditable{
          color: @border-color-error;
        }
      }
    }

    .cil__info-item.hover {
      border: 1.2px solid @border-color;
    }
    .cil__info-item.error {
      border: 1.2px solid @border-color-error;
    }

    .cil__info-item:not(:first-child) .cil__info-item--div {
      border-left:1px solid #ccc;
    }
  }
}
